<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="../../../src/base/_core.js"></script>
    <script type="text/javascript" src="../../../src/core/util/cache.js"></script>
</head>
<body>
<button id="test">TestButton</button>
<button id="testFix">TestButton-Fix</button>
<script type="text/javascript">
    var testNode = document.getElementById('test');
    var testNodeFix = document.getElementById('testFix');
    /**
     * 总结一下：V2
     * 这里可以直接引用linejs里的cache功能，可以减少很多的code
     * 不过，实际当中，一般不会在el上bind事件
     * 而且，一般的javascript framework当中，会把这些事件冒泡到document上去
     * 这样我们只需要关心document上的东西就ok了。在document上绑一个序号，或者字符串
     * 对应到globalCache里，即可实现！
     */

    (function (document, window) {
        var hasAttach = false;
        var ln = {
            attach:(function () {
                if (document.addEventListener) {
                    return function (el, eventName, fn, useCapture) {
                        el.addEventListener(eventName, fn, useCapture || false);
                    };
                } else {
                    return function (el, eventName, fn, useCapture) {
                        var handler = line.getData(el, eventName);
                        if (!handler[eventName]) {
                            handler[eventName] = [];
                        }
                        handler[eventName].push(fn);
                        line.setData(el, eventName, handler);
                        if (!hasAttach) {
                            el.attachEvent('on' + eventName, function () {
                                var fn;
                                while(fn=handler[eventName].shift()){
                                    fn();
                                }
                            });
                            hasAttach = true;
                        }
                    };
                }
            }()),
            detach:function () {}
        };
        window.ln = ln;
    }(document, window));
    /**
     * Fixed part
     */
    ln.attach(testNodeFix, 'click', function () {
        console.log('click 1111');
    });
    ln.attach(testNodeFix, 'click', function () {
        console.log('click 2222');
    });
    ln.attach(testNodeFix, 'click', function () {
        console.log('click 3333');
    });
    ln.attach(testNodeFix, 'click', function () {
        console.log('click 4444');
    });


</script>
</body>
</html>